<template>
	<div class="banner">
		<el-carousel :interval="1000" arrow="never"  height="15rem">
			<el-carousel-item v-for="item in homelist" :key="item.id">
				<img :src="`/api/public/showimg/`+item.picture" />
			</el-carousel-item>
		</el-carousel>
	</div>
</template>

<script>
	export default {
		name: "HomeSwiper",
		props: ['proplist'],
		data() {
			return {
				homelist: []
			}
		},
		watch: {
			//如果数据是请求获取，基本都是需要监听props
			proplist() {
				this.homelist = this.proplist;
			}
		},

	}
</script>

<style scoped>
	.banner {
		width: 100%;
		height: 15rem;
	}

	.banner img {
		width: 100%;
		height: inherit;
	}
	/deep/ .el-carousel__button {
		width: auto;;
		/* height: 0.5rem; */
	}
</style>